<template>
    <div>
        <template v-for="(item,index) of time">
            <section class="login_message">
                <div>
                    <!-- <label>开业时间<input type="text" placeholder="请选择开业时间" v-model="send_start" readonly @click="openTime(0)"></label> -->
                    <label>开始时间({{index+1}})<input type="time" placeholder="请选择开业时间" v-model="item[0]"></label>
                </div>
            </section>
            <section class="login_message">
                <div>
                    <!-- <label>停业时间<input type="text" placeholder="请选择停业时间" v-model="send_end" readonly @click="openTime(1)"></label> -->
                    <label>结束时间({{index+1}})<input type="time" placeholder="请选择停业时间" v-model="item[1]"></label>
                </div>
            </section>
        </template>
        <section class="login_message">
            <div class="add—time">
                <p  @click="addSend"><i class="iconfont icon-jia add"></i>增加营业时间段</p>
                <p  @click="reduceSend"><i class="iconfont icon-jian add"></i>减少营业时间段</p>
            </div>
        </section>
    </div>
</template>
<script>
export default {
    name: "timeSet",
    props:['time'],
    data() {
        return {
            
        }
    },
    methods:{
        addSend(){
                this.time.push([])
        },
        reduceSend(type){
                if(this.time.length > 1) this.time.pop();
            
        }
    }
}
</script>
<style scoped>
    .login_message{
        width: 100%;
    }
    .login_message label{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .login_message input{
        border: none;
        width: 60%;
        font-size: 1rem;
        margin: 0;
    }
    .login_message span{
        width: 40%;
        text-align: left;
    }
    .login_message>div{
        border-bottom: 1px solid #d8d8d8;
        width: 90%;
        margin: auto;
    }
    .add—time{
        line-height: 3rem;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }
    .add—time .add{
        color: #333;
        margin: 0 0.4rem;
    }
</style>